<style lang="less">
@import '../../../styles/common.less';
</style>

<template>
    <Card style="height:800px">
        <Card>
            <div style="text-align:center;font-size: 34px;">
                新增划拨确认书
            </div>
        </Card>
        <Card>
            <div style="margin-left: 42%;">
                <div style="margin-top:30px">
                    <div style="float:left;width:140px">确认日期：</div>
                    <div>
                        <DatePicker v-model="transferCondition.confirmDate" type="date" style="width: 150px"></DatePicker>
                    </div>
                </div>
                <div style="margin-top:30px">
                    <div style="float:left;width:140px">预拨金额：</div>
                    <div>
                        <Input v-model="transferCondition.assignAccount" style="width: 150px" />
                    </div>
                </div>
                <div style="margin-top:30px">
                    <div style="float:left;width:140px">放款日期：</div>
                    <div style="float:left">
                        <DatePicker v-model="transferCondition.loanBeginDate" type="date" style="width: 150px"></DatePicker>
                    </div>
                    <div style="float:left;margin-left: 10px;">
                        至
                    </div>
                    <div style="float:left;margin-left: 10px;">
                        <DatePicker v-model="transferCondition.loanEndDate" type="date" style="width: 150px"></DatePicker>
                    </div>
                    <Button type="primary" style="margin-top:-4px;margin-left:50px;" @click="calculate">计算</Button>
                </div>
                <div style="margin-top:30px">
                    <div style="float:left;width:140px">放款到账金额：</div>
                    <div>
                        <Input v-model="transferCondition.creditedAmount" style="width: 150px" />
                    </div>
                </div>
                <div style="margin-top:30px">
                    <div style="float:left;width:140px">服务费：</div>
                    <div>
                        <Input v-model="transferCondition.serviceFee" style="width: 150px" />
                    </div>
                </div>
                <div style="margin-top:30px">
                    <div style="float:left;width:140px">贷款合同金额：</div>
                    <div>
                        <Input v-model="transferCondition.contractAmount" style="width: 150px" />
                    </div>
                </div>
                <div style="margin-top:30px">
                    <div style="float:left;width:140px">银行手续费：</div>
                    <div>
                        <Input v-model="transferCondition.bankCharges" style="width: 150px" />
                    </div>
                </div>
                <div style="margin-top:30px">
                    <div style="float:left;width:140px">三方支付手续费：</div>
                    <div>
                        <Input v-model="transferCondition.thirdPaymentFee" style="width: 150px" />
                    </div>
                </div>
                <div style="margin-top:30px">
                    <div style="float:left;width:140px">回拨金额：</div>
                    <div>
                        <Input v-model="transferCondition.callbackAmount" style="width: 150px" />
                    </div>
                </div>
                <div style="margin-top:30px">
                    <div style="float:left;width:140px">未确认金额：</div>
                    <div>
                        <Input v-model="transferCondition.unconfirmedAmount" style="width: 150px" />
                    </div>
                </div>
                <div style="margin-top:30px">
                    <div style="float:left;width:140px">是否到账：</div>
                    <div>
                        <Select v-model="transferCondition.isArrival" class="v-select-wrapper" style="width:150px">
                            <Option v-for="item in whetherAccountList" :value="item.key" :key="item.key">{{ item.label }}</Option>
                        </Select>
                    </div>
                </div>
                <div style="margin-top:30px">
                    <div style="float:left;width:140px">项目名称：</div>
                    <div>
                        <Select v-model="transferCondition.projectCode" class="v-select-wrapper" :label-in-value=true style="width:150px" @on-change="projectChange">
                            <Option v-for="item in projectNameList" :value="item.projectCode" :key="item.projectCode">{{ item.projectName}}</Option>
                        </Select>
                    </div>
                </div>
                <div style="margin-top:30px">
                    <div style="float:left;width:140px">文件名：</div>
                    <div>
                        <Select v-model="transferCondition.fileId" class="v-select-wrapper" style="width:150px">
                            <Option v-for="item in fileNameList" :value="item.id" :key="item.id">{{ item.fileName }}</Option>
                        </Select>
                    </div>
                </div>
                <div style="margin-top:30px;margin-left: 50px;">
                    <Button type="primary" @click="determineAdd" style="margin-left: 20px;">确定新增</Button>
                    <Button type="primary" @click="goBack" style="margin-left: 20px;">返回</Button>
                </div>
            </div>
        </Card>
    </Card>
</template>

<script>
export default {
  name: 'mutative-router',
  data () {
    return {
      transferCondition: {
        confirmDate: '',
        assignAccount: '',
        loanBeginDate: '',
        loanEndDate: '',
        creditedAmount: '',
        serviceFee: '',
        contractAmount: '',
        bankCharges: '',
        thirdPaymentFee: '',
        callbackAmount: '',
        unconfirmedAmount: '',
        isArrival: '',
        projectCode: '',
        projectName: '',
        fileId: ''
      },
      statusList: [
        {
          'key': '',
          'label': '请选择'
        },
        {
          'key': '1',
          'label': '已发送'
        },
        {
          'key': '0',
          'label': '待发送'
        },
        {
          'key': '2',
          'label': '已确认'
        }
      ],
      projectNameList: [
      ],
      fileNameList: [],
      whetherAccountList: [
        {
          'key': '0',
          'label': '是'
        },
        {
          'key': '1',
          'label': '否'
        }
      ]
    }
  },
  computed: {
    avatorImage () {
      return localStorage.avatorImgPath
    }
  },

  created () {
    // 初始化当前页面请求对象实例
    this.$ajax = this.$util.ajax()
    this.getProjectList()
  },

  methods: {
    determineAdd () {
      var vm = this
      if (vm.transferCondition.fileId === '' || vm.transferCondition.fileId === null) {
        this.$Message.warning('请选择文件名')
        return
      }
      this.$ajax.post(this.$appContext.marvels_core_financial + 'financial/fund/bhLiquidation/service/addConfirmTransfer', vm.transferCondition).then(re => {
        var data = re.data
        var message = data.message
        this.$Message.warning(message)
        vm.goBack()
      }).catch(er => {

      })
    },
    projectChange (value) {
      var vm = this
      vm.transferCondition.projectName = value.label
      this.calculate()
    },
    getProjectList () {
      var vm = this
      this.$ajax.post(this.$appContext.marvels_core_financial + 'financial/fund/bhLiquidation/service/getProjectList').then(re => {
        var data = re.data
        vm.projectNameList.push({ 'projectCode': '', 'projectName': '请选择' })
        for (var projectNameLength = 0; projectNameLength < data.data.list.length; projectNameLength++) {
          vm.projectNameList.push(data.data.list[projectNameLength])
        }
      }).catch(er => {

      })
    },
    goBack () {
      this.$router.push({ name: 'transfer-confirm' })// 类似post传参
    },
    calculate () {
      var vm = this
      this.$ajax.post(this.$appContext.marvels_core_financial + 'financial/fund/bhLiquidation/service/confirmTransferCalculate', vm.transferCondition).then(re => {
        var data = re.data
        vm.transferCondition.creditedAmount = data.data.creditedAmount
        vm.transferCondition.serviceFee = data.data.serviceFee
        vm.transferCondition.contractAmount = data.data.contractAmount
        if (data.data.list != null && (vm.fileNameList == null || vm.fileNameList.length < 1)) {
          this.fileNameList.push({ 'id': '', 'fileName': '请选择' })
          for (var fileNameLength = 0; fileNameLength < data.data.list.length; fileNameLength++) {
            vm.fileNameList.push({ 'id': data.data.list[fileNameLength].id, 'fileName': data.data.list[fileNameLength].fileName })
          }
        }
      }).catch(er => {

      })
    }
  }

}
</script>
<style>
</style>
